//
// Variables
// --------------------------------------------------
//== Colors

@gray-base:              #2b2b2b;
@gray-darker:            #818181;
@gray-dark:              #b0b0b0;
@gray:                   #cfcfcf;
@gray-light:             #ececec;
@gray-lighter:           #f2f2f2;


@link-lighter:           #9ccef1;
@link-light:             #7cc6ff;
@link:                   #70d2ff;
@link-dark:              #0092ff;
@link-darker:            #046ae8;

@brand-primary:         darken(#428bca, 6.5%); // #337ab7
@brand-success:         #85bd52;
@brand-info:            #5bc0de;
@brand-warning:         #f0ad4e;
@brand-danger:          rgb(255, 1, 1);


//== Scaffolding脚手架
//## Settings for some of the most global styles.

//** Background color for `<body>`.
//** Global text color on `<body>`.
@main-color:            @gray-base;
@text-color:            @gray-darker;

@tips-color:            @gray-dark;
@shadow-color:          @gray;
@line-color:            @gray-light;
@border:                1px solid @gray-light;
@gray-bg:               @gray-lighter;
@body-bg:               #fff;

@btn-color:             #fff;


@link-bg-color:         @link-lighter;
@link-shadow-color:     @link-light;
@link-border-color:     @link;
@link-border:           1px solid @link;
//** Global textual link color.
@link-color:            @link-dark;
//** Link hover color set via `darken()` function.
@link-hover-color:      @link-darker;
//** Link hover decoration.
@link-hover-decoration: underline;


//== Typography
//
//## Font, line-height, and color for body text, headings, and more.

@font-family-sans-serif:  "Helvetica Neue", Helvetica, Arial, sans-serif;
@font-family-serif:       Georgia, "Times New Roman", Times, serif;
//** Default monospace fonts for `<code>`, `<kbd>`, and `<pre>`.
@font-family-monospace:   Menlo, Monaco, Consolas, "Courier New", monospace;
@font-family-base:        @font-family-sans-serif;

@font-size-base:          1rem;
@font-size-large:         ceil((@font-size-base * 1.6));
@font-size-small:         floor((@font-size-base * 0.8));

@font-size-h1:            (@font-size-base * 1.6);
@font-size-h2:            (@font-size-base * 1.5);
@font-size-h3:            (@font-size-base * 1.3);
@font-size-h4:            (@font-size-base * 1.2);
@font-size-h5:            (@font-size-base * 1.1);
@font-size-h6:            (@font-size-base * 0.8);

//** Unit-less `line-height` for use in components like buttons.
@line-height-base:        1.428571429; // 20/14
//** Computed "line-height" (`font-size` * `line-height`) for use with `margin`, `padding`, etc.
@line-height-computed:    floor((@font-size-base * @line-height-base)); // ~20px


// padding
@padding-base:            1rem;
@padding-largest:         3.3rem;
@padding-small:           .8rem;
@padding-smaller:         .5rem;

//radius
@radius-base:             1rem;
@radius-small:            .6rem;
@radius-smaller:            .4rem;

//== Tables
//
//## Customizes the `.table` component with basic values, each used across all table variations.

//** Padding for `<th>`s and `<td>`s.
@table-cell-padding:            8px;
//** Padding for cells in `.table-condensed`.
@table-condensed-cell-padding:  5px;

//** Default background color used for all tables.
@table-bg:                      transparent;
//** Background color used for `.table-striped`.
@table-bg-accent:               #f9f9f9;
//** Background color used for `.table-hover`.
@table-bg-hover:                #f5f5f5;
@table-bg-active:               @table-bg-hover;

//** Border color for table and cell borders.
@table-border-color:            #ddd;


//== Media queries breakpoints
//
//## Define the breakpoints at which your layout will change, adapting to different screen sizes.

// Extra small screen / phone
//** Deprecated `@screen-xs` as of v3.0.1
@screen-xs:                  480px;
//** Deprecated `@screen-xs-min` as of v3.2.0
@screen-xs-min:              @screen-xs;
//** Deprecated `@screen-phone` as of v3.0.1
@screen-phone:               @screen-xs-min;

// Small screen / tablet
//** Deprecated `@screen-sm` as of v3.0.1
@screen-sm:                  768px;
@screen-sm-min:              @screen-sm;
//** Deprecated `@screen-tablet` as of v3.0.1
@screen-tablet:              @screen-sm-min;

// Medium screen / desktop
//** Deprecated `@screen-md` as of v3.0.1
@screen-md:                  992px;
@screen-md-min:              @screen-md;
//** Deprecated `@screen-desktop` as of v3.0.1
@screen-desktop:             @screen-md-min;

// Large screen / wide desktop
//** Deprecated `@screen-lg` as of v3.0.1
@screen-lg:                  1200px;
@screen-lg-min:              @screen-lg;
//** Deprecated `@screen-lg-desktop` as of v3.0.1
@screen-lg-desktop:          @screen-lg-min;

// So media queries don't overlap when required, provide a maximum
@screen-xs-max:              (@screen-sm-min - 1);
@screen-sm-max:              (@screen-md-min - 1);
@screen-md-max:              (@screen-lg-min - 1);
